<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    
  </head>
  <body>
    <form name="f1">
      <p>
        爱好
        <input type="checkbox" name="hobby" value="css" />CSS
        <input type="checkbox" checked name="hobby" value="html" />HTML
        <input type="checkbox" checked name="hobby" value="js" />JS
        <input type="checkbox" name="hobby" value="ts" />TS
      </p>
      <button name="saveBtn" type="button">提交</button>
    </form>
    <script>
      document.f1.saveBtn.onclick = function () {
        const arr = [...document.f1.hobby]
          .filter((el) => el.checked)
          .map((el) => el.value);
        console.log(arr);
      };
      setTimeout(() => {
        const arr = ["ts"];
        document.f1.hobby.forEach(
          (el) => (el.checked = arr.includes(el.value))
        );
      }, 3000);
    </script>
  </body>
</html>
